<template>
	<view class="page-body">
		<view class="content">
			<view class="list" v-if="addressList.length>0">
			<radio-group @change="radioChange" >
				<view class="row" v-for="(row,index) in addressList" :key="index" >
					<view @tap="select(row)">
						<view class="msg flex">
							<view class="name">{{row.consignee}}</view>
							<view class="tel">{{row.tel}}</view>
						</view>
						<view class="address">{{row.cities}}{{row.address}}</view>
					</view>
					<view class="handle flex">
						<label class="radio">
							<radio :value="String(index)" :checked="row.selected==1?true:false" name="address" color="#FF7201" /><text>默认地址</text>
						</label>
						<view class="handle-btn">
							<view class="edit" @click.stop="edit(row)">编辑</view>
							<view class="delete" @click="deleteAddress(row)">删除</view>
						</view>
					</view>
				</view>
			</radio-group>
			</view>
			<view v-else class="noaddress">
				<image src="/static/img/integral/noadddress.png" mode=""></image>
				<view>您还没有填写收货地址</view>
			</view>
		</view>
		<view style="height: 110upx;"></view>
		<view class="footer ">
			<view class="button" @click="add">新增收货地址</view>
		</view>
	</view>
</template>
<script>
	var that;
	import defalut from '@/components/defalut.vue'
	export default {
		data() {
			return {
				isSelect:false,
				addressList:[],
			};
		},
		onShow() {
			that=this;
			this.getAddress()
		},
		onLoad(e) {
			that=this;
			if(e.type=='select'){
				this.isSelect = true;
			}
		},
		methods:{
			getAddress(){
				// that.addressList = [{"id":32,"user_id":4,"consignee":"dwe","tel":"15088132545","cities":"江苏省南京市市辖区","address":"123121","selected":0,"areaid":"9|0|0"},{"id":32,"user_id":4,"consignee":"dwe","tel":"15088132545","cities":"江苏省南京市市辖区","province":"江苏省","city":"南京市","county":"市辖区","address":"123121","selected":0,"type":0,"create_time":1571194644,"update_time":1571194644,"areaid":"9|0|0","province_code":320000,"city_code":320100}]
				this.$https.POST({
					url:'/user/myAddress',
					data:{
					},
					success(res){
						that.addressList = res.data;
						
					}
				})
			},
			radioChange(e){
				let index = e.detail.value
				let _thisaddress = that.addressList.find((item,ii)=>{
					return ii == index
				})
				that.$https.POST({
					url:'/mall/modifySelected',
					data:{
					  id:_thisaddress.id,
					},
					success(res){
						that.$showToast(res.message)
					}
				})
			},
			edit(row){
				uni.setStorage({
					key:'address',
					data:row,
					success() {
						uni.navigateTo({
							url:"edit/edit?type=edit"
						})
					}
				});
			},
			deleteAddress(row){
				let id = row.id;
				uni.showModal({
					title: '删除提示',
					content: '确认要删除此收货地址吗？',
					success: (res)=>{
						if (res.confirm) {
							that.$https.POST({
								url:'/mall/deleteAddress',
								data:{
								  id:id
								},
								success(res){
									that.$showToast(res.message)
									let index = that.addressList.findIndex((item)=>{
										return item.id==id;
									})
									that.addressList.splice(index,1);
									that.$set(that.addressList,that.addressList)
								}
							})
						}
					}
				});
			},
			add(){
				uni.navigateTo({
					url:"/pages/user/address/edit/edit?type=add"
				})
			},
			select(row){
				//是否需要返回地址(从订单确认页跳过来选收货地址)
				if(!this.isSelect){
					return ;
				}
				uni.setStorage({
					key:'selectAddress',
					data:row,
					success() {
						uni.navigateBack();
					}
				})
			}
		},
		onUnload() {
			that = null;
		},
		components:{
			defalut
		}
	}
</script>

<style lang="scss" scoped>
	.page-body{background: #f6f6f6;}
	.noaddress{
		text-align: center; margin-top: 300upx;
		image{width: 200upx;height: 200upx;margin-bottom: 10upx;}
	}
	.footer{
		position: fixed;bottom: 0;left: 0;width: 100%;padding:14upx 40upx;background: #fff;box-sizing: border-box;
		.button{
			line-height: 80upx;
			height: 80upx;
			border-radius: 10upx;
			overflow: hidden;
			background: $maincolor;
			width: 100%;
		}
	}
	.list{
		.row{
			background: #fff;margin-bottom: 20upx;
			.msg{
				justify-content: space-between; padding: 0 24upx;color: #333333;line-height: 70upx;
				.name{font-size: 32upx;}
				.tel{font-size: 28upx;}
			}
			.address{color:#666 ;line-height: 50upx; padding: 0 24upx 20upx;border-bottom: 1px dashed #f3f3f3;}
			.handle{
				height: 82upx;justify-content: space-between; padding: 0 24upx;
				.radio{
					line-height: 82upx;
				}
				&-btn{
					.edit,.delete{width: 136upx;height: 54upx;border:1px solid #cdcdcd;line-height: 52upx;color: #333;text-align: center;margin-left: 20upx;display: inline-block;border-radius: 10upx;}
				}
			}
		}
		
	}
</style>
